<template>
  <div class="container">
    <div class="button-group">
      <el-row>
        <el-sapn :span="4">基础用法：</el-sapn>
        <el-span>
          <in-button >默认按钮</in-button>
          <in-button type="primary" >主要按钮</in-button>
          <in-button type="success" >成功按钮</in-button>
          <in-button type="info" >信息按钮</in-button>
          <in-button type="warning" >警告按钮</in-button>
          <in-button type="danger" >危险按钮</in-button>
        </el-span>
      </el-row>
      <br>
      <el-row>
        <el-sapn :span="4">禁用状态：</el-sapn>
        <el-span>
          <in-button >默认按钮</in-button>
          <in-button type="primary" disabled >主要按钮</in-button>
          <in-button type="success" disabled>成功按钮</in-button>
          <in-button type="info" disabled>信息按钮</in-button>
          <in-button type="warning" disabled>警告按钮</in-button>
          <in-button type="danger" disabled>危险按钮</in-button>
        </el-span>
      </el-row>
      <br>
      <el-row>
        <el-sapn :span="4">流光按钮（可动态设置颜色）：</el-sapn>
        <el-span>
          <in-button type="stream"  color="#03e9f4" bgcolor="#283046" >#283046</in-button>
          <in-button type="stream"  color="#4839eb" bgcolor="#283046">#4839eb</in-button>
          <in-button type="stream"  color="#82868b" bgcolor="#283046">#82868b</in-button>
          <in-button type="stream"  color="#ff9f43" bgcolor="#283046">#ff9f43</in-button>
          <in-button type="stream"  color="#ea5455" bgcolor="#283046">#ea5455</in-button>
        </el-span>
      </el-row>
    </div>
  </div>
</template>

<script>
export default {
  name: 'memo',
  props: {
  },
  data: function () {
    return {
      level: 6
    }
  },
  methods: {
  },
  components: {
  }
}
</script>

<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.button-group{
  margin: 30px;
  text-align: left;
}
</style>
